{extend name="base"}
{block name="pageBody"}
<section class="content-wrapper">
  <div class="content-container container">
    <div class="heading-block">
      <h1>我买过的</h1>
    </div>
    <div class="new-product-block">
      <ul class="product-grid">
        {volist name="orders" id="order" empty="暂时没有数据"}
        <li>
          <div class="pro-img">
            <img title="Freature Product" alt="Freature Product" src="{$order.picture_address}" />
          </div>
          <div class="pro-content">
            <p>{$order.commodity_name}</p>
          </div>
          <div class="pro-price">{$order.order_price}￥</div>
          <div class="pro-btn-block"> 
          <a class="add-cart right" onclick="getOrderInfo('{$order.order_id}')">查看详情</a> </div>
          <div class="pro-link-block"> <a class="add-wishlist left" title="Add to wishlist">{$order.gmt_create}</a>
            <div class="clearfix"></div>
          </div>
        </li>
        {/volist}
      </ul>
    </div>
    <div class="news-letter-container">
      <div class="free-shipping-block">
        <h1>ENJOY FREE SHIPPING</h1>
        <p>on all orders as our holiday gift for you!</p>
      </div>
      <div class="news-letter-block">
        <h2>SIGN UP FOR OUR NEWSLETTER</h2>
        <input type="text" value="Enter email address" title="" />
        <input type="submit" value="Submit" title="Submit" />
      </div>
    </div>
  </div>
</section>
<!-- 一个分类框 -->
{/block}

{block name="model"}
  <script>
    function getOrderInfo(order_id){
      $.getJSON("{:url('commoditydo/getBuyCommodityInfo')}",{order_id:order_id},function(data){
        var order = data.data;
        console.log(order);
        $("#CommodityInfo input[name='commodity_name']").val(order.commodity_name);
        $("#CommodityInfo input[name='order_price']").val(order.order_price);
        $("#CommodityInfo input[name='commodity_num']").val(order.commodity_num);
        $("#CommodityInfo input[name='commodity_type']").val(order.category_name);
        $("#CommodityInfo input[name='commodity_addr']").val(order.commodity_addr);
        getPics(order.commodity_id);
        $('#commodity_Info').modal('show');
      })
    }

    function getPics(commodity_id){
    $.getJSON("{:url('commoditydo/getCommodityPic')}",{commodity_id:commodity_id},function(data){
      $("#Pics").html("");
      if(0 == data.code){
        var pictures = data.data;
        for(var i=0;i<pictures.length;i++){
          $("#Pics").append("<li><img style='width:100px' src='"+pictures[i].picture_address+"'></li>");
        }
        $('#show_pic').modal('show');
      }else{
        alert("获取图片失败");
      }
    });
  }
  </script>
  <div id="commodity_Info" class="modal hide fade" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
    <div class="modal-header">
      <button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
      <h3 id="myModalLabel">订单信息</h3>
    </div>
    <form id="CommodityInfo" class="form-horizontal" onsubmit="return false;">
      <br>
      <div class="control-group">
              <label class="control-label">商品名称</label>
              <div class="controls">
                <input type="text" name="commodity_name" readonly><br>
            </div>
          </div>
          <div class="control-group">
              <label class="control-label">订单价格</label>
              <div class="controls">
                <input type="number" name="order_price" min="0.00" step="0.01" readonly > 元<br>
            </div>
          </div>
      <div class="control-group">
              <label class="control-label">订单数量</label>
              <div class="controls">
                <input type="number" name="commodity_num" readonly ><br>
            </div>
          </div>
          <div class="control-group">
              <label class="control-label">商品类别</label>
              <div class="controls">
                <input type="text" name="commodity_type" readonly ><br>
            </div>
          </div>
      <div class="control-group">
              <label class="control-label">商品地址</label>
              <div class="controls">
                <input type="text" name="commodity_addr" readonly ><br>
            </div>
          </div>
          <div class="control-group">
            <label class="control-label">商品图片</label>
              <div class="controls">
                   <ul id="Pics" >
              </ul>
            </div>
          </div>
    </form>
    <div class="modal-footer">
      <button class="btn" data-dismiss="modal" aria-hidden="true">Close</button>
    </div>
  </div>
{/block}